@import "variables";

seed-single-test-scores {
  .echarts-box {
    #broken-line-chart {
      height: pxTorem(340);
    }
  }
  .circle-exp {
    position: relative;
    top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: standard($f, f6);
    color: color($h5, c4);
    div{
      display: flex;
      align-items: center;
      &:before {
        content: '';
        display: block;
        margin-right: pxTorem(10);
        width: pxTorem(12);
        height: pxTorem(12);
        border-radius: 100%;
      }
    }
    .first {
      &:before {
        background: color($h5, c13);
      }
    }
    .sec {
      &:before {
        background: #de4a59;
      }
    }
    .third {
      &:before {
        background: color($h5, c15);
      }
    }
  }
  .train-title {
    font-size: standard($f, f4);
    .test-name {
      font-weight: bold;
      color: color($h5, c2);
    }
    .score-history {
      color: color($h5, c13);
    }
  }
  .score-list {
    border-top: pxTorem(20) solid color($h5, c9);
    .score-item {
      height: pxTorem(110);
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 pxTorem(24);
      .score-name {
        flex: 1;
        font-size: standard($f, f2);
        color: color($h5, c2);
      }
      .score-result {
        font-size: standard($f, f4);
        color: color($h5, c4);
      }
    }
  }
}
